import styled from 'styled-components';
import {LogoPicUrl} from "../../common/API";

export const HeaderWrapper = styled.div`
    width:100%;
    height:60px;
    background:#fff;
    box-shadow:0 0 10px #ccc;
`;

export const HeaderCenterWrapper = styled.div`
    width:1200px;
    height:100%;
    margin:0 auto;
`;

export const HeaderLogo = styled.div`
    width:68px;
    height:50px;
    margin-left:36px;
    background:url(${LogoPicUrl});
    background-size:contain;
    margin-top:5px;
    float:left;
`;

export const HeaderTips = styled.ul`
    float:left;
    margin-left:50px;
    .tips{
       float:left;
       margin-right:30px;
       .tipsLink{
           display:block;
           height:50px;
           line-height:50px;
           text-align:center;
           box-sizing:border-box;
           cursor:pointer;
           font-size:16px;
           color:#276692;
           text-decoration: none;
       }
       .tipsLink:hover{
             border-bottom:3px solid #276692;
        }
        .current{
             border-bottom:3px solid #276692;
        }
    }
    
`;


export const HeaderSearch = styled.input.attrs({
    placeholder: "搜索关键词以空格隔开",
})`
  float:right;
  width:222px;
  height:34px;
  box-sizing:border-box;
  border:1px solid #276692;
  border-radius:4px;
  padding:0 4px;
  margin-top:13px;
  margin-right:20px;
`;

export const HeaderAccount = styled.div`
       float:right;
       margin-right:20px;
       
`;

export const HeaderRegister = styled.div`
    line-height:60px;
    text-align:center;
     float:left;
     color:#276692;
     font-size:16px;
     cursor:pointer;
`;

export const HeaderSplit = styled.div`
    line-height:60px;
    text-align:center;
     float:left;
     margin:0 4px;
     color:#276692;
`;

export const HeaderLogin = styled.div`
     line-height:60px;
    text-align:center;
    float:left;
    color:#276692;
    font-size:16px;
     cursor:pointer;
`;